<template>
    <div class="box">
        <!-- 头部 -->
        <Header v-if="this.$route.meta.is_header"></Header>
        <article>
            <!-- 内容部分 -->
                <router-view></router-view>
        </article>
        <div class="di">
            <Footer v-if="this.$route.meta.is_footer"></Footer>
        </div>
    </div>
</template>

<script>
import 'animate.css'
import Header from '@/components/Header.vue'
import Footer from '@/components/footer.vue'
import axios from './http/axios'
export default {
  data () {
    return {

    }
  },
  methods: {
    async add () {
      // const res = await axios('/index/index')
    }
  },
  components: {
    Header: Header,
    Footer: Footer
  },
  mounted () {
  }
}
</script>

<style lang="scss" scoped>
.box{
    width: 100%;
    height: 100%;

    background-color: #ffffff;

    display: flex;

    flex-direction: column;
    article{
        flex: 1;
        margin-bottom: 50px;
        overflow: auto;
    }
    .di{
        position: fixed;
        bottom: 0;
        z-index: 999;
    }
}

</style>
